<template>
    <div class="all">
      <!--    头部 标题-->
      <header>
        <div class="div">
           <span @click="onClickLeft" class="fanhui">
              <img src="../../assets/返回.png" alt="">
              <span class="sides">返回</span>
            </span>
        </div>
        <div class="div">
          <div @click="DateSelect()" style="display: flex;align-items: center" v-if="active===0">
              <span style="margin-right: 2vw; font-family: PingFang SC;font-weight: bold;
      font-size: 15px;color: #999999;">请选择采集日期:</span>
            <span style="font-family: PingFang SC;
  font-weight: bold;font-size: 15px;color: #333;">{{activeDate}}</span>
            <img v-if="show===false" src="../../assets/sortBottom.png" alt="" style="width: 8px;height: 5px;margin-left: 2vw">
            <img v-else src="../../assets/sortTop.png" alt="" style="width: 8px;height: 5px;margin-left: 2vw">
          </div>
        </div>
      </header>
      <!--    列表-->
      <div style="height: 84vh;overflow: scroll" v-if="active===0">
        <!--      listArr[index].url, listArr[index].id, listArr[index].name, listArr[index].unit-->
        <ul class="ulList"
            v-for="(item, index) in getArr"
            :key="index"
            :id="item.HEALTHDATADYNAMIC_ID"
            @click="go(listArr[index].url,
                   item.HEALTHDATADYNAMIC_ID,
                   item.NAME,
                   item.UNIT)"
        >
          <!--                  :class="[xuetangList[0].content != undefined && xuetangList[1].content != undefined && index === 3 ? 'height' : 'ulList']"-->
          <li class="left">
            <img :src="listArr[index].img" alt="">
            <a class="title">{{item.NAME}}</a>
          </li>
          <li class="center" >
            <div class="center_Top" v-if="index != 3">
              <a style="font-size: 16px;margin-top: 2vw;margin-bottom: 3vw;color: #999999">
              </a>
              <a class="num" v-if="everyList[index] != undefined
               && index != 3">{{everyList[index].content}}</a>
              <a class="unit" v-if="everyList[index] != undefined
                                    && everyList[index].content != undefined
                                    && index != 3"> {{item.UNIT}}</a>
            </div>
            <div style="margin: 5px 0" v-if="xuetangList[0] != undefined
                                             && xuetangList[0].content != undefined
                                             && index === 3" class="" >
              <a style="font-size: 16px;color: #999999" v-if="xuetangList[0] != undefined && xuetangList[0].content != undefined">{{xtColumns[0]}}</a>
              <a class="num">{{xuetangList[0].content}}</a>
              <a class="unit">{{item.UNIT}}</a>
            </div>
            <div style="margin: 5px 0" v-if="xuetangList[1] != undefined
                                              && xuetangList[1].content != undefined
                                              && index === 3" class="" >
              <a style="font-size: 16px;color: #999999">{{xtColumns[1]}}</a>
              <a class="num">{{xuetangList[1].content}}</a>
              <a class="unit">{{item.UNIT}}</a>
            </div>
            <div style="margin: 5px 0" v-if="xuetangList[2] != undefined
                                             && xuetangList[2].content != undefined
                                              && index === 3" class="" >
              <a style="font-size: 16px;color: #999999">{{xtColumns[2]}}</a>
              <a class="num">{{xuetangList[2].content}}</a>
              <a class="unit">{{item.UNIT}}</a>
            </div>
            <div class="time center_Bottom">
              <a v-if="everyList.length>0 &&
               everyList[index].id>0 && index != 3">
                {{timeSplice(everyList[index].time)}}
              </a>
              <a v-else-if="xuetangList.length>0
                           && xuetangList[3] != undefined
                           && xuetangList[3].time != undefined
                           && index === 3">{{timeSplice(xuetangList[3].time)}}</a>
            </div>
          </li>
          <li class="right" v-if="index != 3" @click.stop="selectNumber(
                                                    item.HEALTHDATADYNAMIC_ID,
                                                    item.UNIT,
                                                    listArr[index].null,
                                                    everyList[index].content,
                                                    everyList[index].time,
                                                    everyList[index].id
         )">
            <img src="../../assets/jia.png" alt="">
          </li>
          <li class="right" v-else @click.stop="selectNumber(
                                                    item.HEALTHDATADYNAMIC_ID,
                                                    item.UNIT,
                                                    listArr[index].null,
                                                    '',
                                                    xuetangList[3].time,
                                                    ''
                                                    // everyList[index].content,
                                                    // everyList[index].time,
                                                    // everyList[index].id
         )">
            <img src="../../assets/jia.png" alt="">
          </li>
        </ul>

      </div>
      <!--    我的档案内容-->
      <div class="content" v-else>
        <div class="personalInf">
          <van-collapse v-model="activeNames">
            <van-collapse-item title="个人基本信息" name="1">
              <div class="personalInf_content">
                <ul v-for="(item,index) in formItemList" :key="index">
                  <li>
                    <a class="leftText">头像</a>
                    <van-image
                      round
                      width="13vw"
                      height="13vw"
                      :src="item.PHOTO"
                      fit="cover"
                    />
                  </li>
                  <li>
                    <a class="leftText">姓名</a>
                    <a class="rightText">{{item.name}}</a>
                  </li>
                  <li>
                    <a class="leftText">性别</a>
                    <a class="rightText">
                      <span v-if="item.sex == 1">男</span>
                      <span v-else-if="item.sex == 2">女</span>
                    </a>
                  </li>
                  <li>
                    <a class="leftText">年龄</a>
                    <a class="rightText">{{(item.age)}}</a>
                  </li>
                  <li>
                    <a class="leftText">出生日期</a>
                    <a class="rightText">{{item.birthday}}</a>
                  </li>
                  <li>
                    <a class="leftText">家庭住址</a>
                    <a class="rightText">{{item.address}}</a>
                  </li>
                  <li>
                    <a class="leftText">联系电话</a>
                    <a class="rightText">{{item.phone}}</a>
                  </li>
                  <li>
                    <a class="leftText">紧急联系人</a>
                    <a class="rightText">{{item.emergencycontact}}</a>
                  </li>
                  <li>
                    <a class="leftText">紧急联系人电话</a>
                    <a class="rightText">{{item.emergencycontactphone}}</a>
                  </li>
                  <li>
                    <a class="leftText">家庭医生</a>
                    <a class="rightText">{{item.familydoctor}}</a>
                  </li>
                  <li>
                    <a class="leftText">身体状况</a>
                    <a class="rightText">{{item.physicalcondition}}</a>
                  </li>
                  <li>
                    <a class="leftText">睡眠质量</a>
                    <a class="rightText">{{item.sleep}}</a>
                  </li>
                  <li>
                    <a class="leftText">居住环境</a>
                    <a class="rightText">{{item.livingenvironment}}</a>
                  </li>
                  <li>
                    <a class="leftText">活动情况</a>
                    <a class="rightText">{{item.activity}}</a>
                  </li>
                </ul>
              </div>
            </van-collapse-item>
          </van-collapse>
        </div>
        <div class="tableInf">
          <div class="tabHeader" ref="tab" style="">
            <div>
              <a class="header_text">康复情况:
              </a>
              <!--康复信息按钮-->
              <span class="spanDiv">
              <input type="button" v-for="(btnItem, btnIndex) in btnList"
                     :key="btnIndex" :value="btnItem" class="btn"
                     @click="btnChange(btnIndex)" :class="{'cur': btnIndex === msg}">
            </span>
            </div>
            <div v-if="msg===4" class="riqiDiv" style="background: #fff;">
              <a class="header_text">日期选择:</a>
              <span class="spanDiv">
                <input type="button"
                       class="btn"
                       v-for="(item, index) in dayList"
                       :key="index"
                       :value="item"
                       @click="changeTab(index)"
                       :class="{'cur': index === dayIndex}">
              </span>

            </div>
          </div>
          <div class="tab1" v-if="msg===0 && PingGUList.length>0">
            <div class="tab" v-for="(item, index) in PingGUList" :key="index">
              <ul>
                <li class="flLeft">
                  <a v-for="(t, index) in tabTitle0" :key="index">{{t}}:</a>
                </li>
                <li class="flRight">
                  <a>{{item.pdbmc}}</a>
                  <a>{{item.kdrq}}</a>
                  <a>{{item.pdrq}}</a>
                  <a>{{item.pdry}}</a>
                  <a>{{item.pdfs}}</a>
                  <a>{{item.psjg}}</a>
                  <!--                <a v-if="item.tjbz==0" class="red">未评估</a>-->
                  <!--                <a v-else-if="item.tjbz==1">已评估</a>-->
                </li>
              </ul>
            </div>
          </div>
          <div class="tab1" v-else-if="msg===1">
            <div class="tab" v-for="(item, index) in selfList" :key="index">
              <ul>
                <li class="flLeft">
                  <a v-for="(t, index) in selfTab" :key="index">{{t}}:</a>
                </li>
                <li class="flRight">
                  <a>{{item.ASSESS_NAME}}</a>
                  <a>{{formatDate(new Date(item.CREATED_AT))}}</a>
                  <a>{{item.ALL_POINTS}}</a>
                  <a>{{item.RESULT}}</a>
                  <!--                <a v-if="item.tjbz==0" class="red">未评估</a>-->
                  <!--                <a v-else-if="item.tjbz==1">已评估</a>-->
                </li>
              </ul>
            </div>
          </div>
          <div class="tab1" v-else-if="msg===2 && ZhiliaoList.length>0">
            <div class="tab" v-for="(item, index) in ZhiliaoList" :key="index">
              <ul>
                <li class="flLeft">
                  <a v-for="(t, index) in tabTitle1" :key="index">{{t}}:</a>
                </li>
                <li class="flRight">
                  <a>{{item.xmmc}}</a>
                  <a>{{item.hylx}}</a>
                  <a>{{item.zxrq_yy}}</a>
                  <a>{{item.yysjd}}</a>
                  <a>{{item.zxrq}}</a>
                  <a>{{item.jfsl}}</a>
                  <a>嘱托</a>
                  <a v-if="item.zxbz==0" class="red">未执行</a>
                  <a v-else-if="item.zxbz==1">已执行</a>
                </li>
              </ul>
            </div>
          </div>
          <div class="tab1" v-else-if="msg===3 && HuLiList.length>0">
            <div class="tab" v-for="(item, index) in HuLiList" :key="index">
              <ul>
                <li class="flLeft">
                  <a v-for="(t, index) in tabTitle2" :key="index">{{t}}:</a>
                </li>
                <li class="flRight">
                  <a class="textLfet">{{item.xmmc}}</a>
                  <a>{{item.zxry}}</a>
                  <a>{{item.zxrq}}</a>
                  <a>{{item.yzzt}}</a>
                  <a v-if="item.wcbz==0" class="red">未完成</a>
                  <a v-else-if="item.wcbz==1">已完成</a>
                </li>
              </ul>
            </div>
          </div>
          <div class="tab1" v-else-if="msg===4 && tableList.length>0">
            <div style="height: auto;background: white;padding: 2vh 0">
              <table class="table" cellpadding="0" cellspacing="0" border="0">
                <thead>
                <tr>
                  <td>日期</td>
                  <td>详情</td>
                </tr>
                </thead>
                <tbody>
                <tr v-for="(item, index) in tableList" :key="index">
                  <td>{{item.days}}</td>
                  <td style="color: #D43030;" @click="xiangqing(item.days)">详情</td>
                </tr>
                </tbody>
              </table>
            </div>
          </div>
          <div v-else class="tab1" style="height: 50vh;display: flex;align-items: center;justify-content: center;color: #666">暂无更多信息</div>
        </div>
      </div>
      <!-- 头部 标题图标   点击选择日期-->
      <van-popup v-model="show" style="height: 50%;" round position="bottom">
        <van-picker
          title="请选择采集日期"
          show-toolbar
          :columns="columns"
          :default-index="columnsSel"
          @confirm="onConfirm"
          @cancel="show = false"
        >
        </van-picker>
      </van-popup>

      <!--    血糖 餐前餐后-->
      <van-popup position="bottom" :style="{bottom: '50px'}" :close-on-click-overlay="false" v-model="xueTangShow" round >
        <van-picker
          title="请选择餐前/后"
          show-toolbar
          :columns="xtColumns"
          @confirm="xtOnConfirm"
          :default-index="xtColumns.length - 1"
          @cancel="xueTangShow = false"
          confirm-button-text = '下一步'
        >
        </van-picker>
      </van-popup>

      <!--    列表 + 点击弹出键盘-->
      <JianPan  ref="jPanChild" :idMsg="listID" :unitMsg = 'unitText' @numMsg="numMsg"></JianPan>
      <!--    脚部 -->
      <van-tabbar v-model="active" @change="onchange" v-if="isShow == true">
        <van-tabbar-item >
          <span>健康数据采集</span>
          <template #icon="props">
            <!--          :src="props.active ? icon.active : icon.inactive"-->
            <img src="../../assets/数据选中@2x.png" v-if="active===0"/>
            <img src="../../assets/数据未选中@2x.png" v-else/>
          </template>
        </van-tabbar-item>
        <van-tabbar-item >
          <span>我的健康档案</span>
          <template #icon="props">
            <!--          :src="props.active ? icon.active : icon.inactive"-->
            <img src="../../assets/档案选中@2x.png" v-if="active===1"/>
            <img src="../../assets/档案未选中@2x.png" v-else/>
          </template>
        </van-tabbar-item>
      </van-tabbar>
      <!--    <ListMenu></ListMenu>-->
    </div>
</template>
<script>
import ListMenu from '../../components/Vue/ListMenu'
import ImgHttp from '../../http/video.http'
import JianPan from '../../components/Vue/JianPan'
import {Toast} from 'vant'
import $ from 'jquery'
// import local from '../local/local'
export default {
  name: 'Health',
  components: {
    'ListMenu': ListMenu,
    'JianPan': JianPan
  },
  data () {
    return {
      isShow: false,
      activeNames: ['0'], // 控制个人信息开关
      show: false, // 选择日期键盘的开关
      selectNum: false, // + 图标键盘的开关
      active: 0,
      listArr: [
        {
          'name': '运动',
          'unit': '千卡',
          'img': require('../../assets/运动@2x.png'),
          'url': 'run',
          'id': '1',
          'null': '0'
        },
        {
          'name': '睡眠',
          'unit': '小时',
          'img': require('../../assets/睡眠@2x.png'),
          'url': 'run',
          'id': '2',
          'null': '0.0'
        },
        {
          'name': '血压',
          'unit': '毫米汞柱',
          'img': require('../../assets/血压@2x.png'),
          'url': 'run',
          'id': '3',
          'null': '0'
        },
        {
          'name': '血糖',
          'unit': '毫摩尔/升',
          'img': require('../../assets/血糖@2x.png'),
          'url': 'run',
          'id': '4',
          'null': '0'
        },
        {
          'name': '心率',
          'unit': '次/分',
          'img': require('../../assets/心率@2x.png'),
          'url': 'run',
          'id': '5',
          'null': '0'
        },
        {
          'name': '体重',
          'unit': '公斤',
          'img': require('../../assets/体重@2x.png'),
          'url': 'run',
          'id': '6',
          'null': '0.00'
        }
      ],
      getArr: [],
      columns: [], // 存储今天之前的所有日期 格式为 x年-x月-x日 今/昨/前天
      dateNum: [], // 存储今天之前的所有日期 格式为 x-x-x
      unitText: '', // 存储传递的单位
      listID: 0, // 存储传递的当前类型的listID
      userid: '', // 存储本地存储的userid
      activeDate: '', // 存储 键盘当前 所处的日期
      xtColumns: ['餐前', '餐后一小时', '餐后两小时'],
      everyList: [], // 存储 请求得到的数据
      columnsSel: '', // 选择的日期
      oldTime: '',
      timea: '',
      xuetangList: [],
      id: '', // 存储当前数据的id
      xueTangShow: false,
      chooseid: '', // 血糖的id选择
      buJi: false, // 补记状态
      content: '', // 存储 当前点击 +添加按钮的 内容
      dates: [], // 存储今天之前的所有日期 格式为 x年-x月-x日
      mzhm: '',
      msg: 0,
      PingGUList: [],
      ZhiliaoList: [],
      HuLiList: [],
      selfList: [],
      titleList: ['头像', '姓名', '性别', '年龄', '出生日期', '家庭住址',
        '联系电话', '紧急联系人', '紧急联系人电话', '家庭医生', '身体状况',
        '睡眠质量', '居住环境', '活动情况'],
      // 个人基本信息
      formItemList: [],
      // 表格表头
      tabTitle0: ['评定量表名', '开立日期', '评定日期', '评定人员', '评定总分', '评定结果'],
      selfTab: ['评定量表名', '评定日期', '评定总分', '评定结果'],
      tabTitle1: ['康复项目', '治疗资源', '预约日期', '预约时间', '治疗时间', '数量', '嘱托', '执行状态'],
      tabTitle2: ['护理项目', '护理人员', '护理时间', '嘱托', '护理状态'],
      btnList: ['评估信息', '自我评估', '治疗信息', '护理信息', '健康数据采集'],
      dayList: ['7天之内', '15天之内', '全部'],
      dayIndex: 0,
      tableList: [],
      isEdit: Number(this.$route.query.isEdit)
    }
  },
  mounted () {
    // 血糖值
    sessionStorage.removeItem('xueTangData')

    // 从网址上截取 userid 后面的值
    this.userid = this.$utils.getUrlKey('userid')
    this.mzhm = this.$utils.getUrlKey('mzhm')
    this.get()
    // this.getDateList(this.userid, this.formatDate(new Date()))
    this.activeDate = this.formatDate(new Date())
    this.$refs.jPanChild.thisTime = this.formatDate(new Date()) // this.timeSplice(this.formatDate(new Date()))
    // this.getPingGu(this.mzhm)
    // this.getZhiliao(this.mzhm)
    // this.getHuLi(this.mzhm)
    // this.getPeople()
    // this.btnChange(0)
  },
  methods: {
    onchange (index) {
      if (index === 0) {
        this.getDateList(this.userid, this.activeDate)
      } else if (index === 1) {
        window.addEventListener('scroll', this.handleScroll, true)
      }
    },
    // 血糖键盘的 下一步按钮
    xtOnConfirm (value, index) {
      this.xueTangVal = value
      this.xueTangShow = false
      this.chooseid = index
      this.$refs.jPanChild.block()
      this.$refs.jPanChild.typeid = 4
    },
    // 获取 今天日期 之前的日期 方法
    getBeforeDate (num, time, dateType) {
      let n = num
      let d = ''
      if (time) {
        d = new Date(time)
      } else {
        d = new Date()
      }
      let year = d.getFullYear()
      let mon = d.getMonth() + 1
      let day = d.getDate()
      if (day <= n) {
        if (mon > 1) {
          mon = mon - 1
        } else {
          year = year - 1
          mon = 12
        }
      }
      d.setDate(d.getDate() - n)
      year = d.getFullYear()
      mon = d.getMonth() + 1
      day = d.getDate()
      var s
      if (dateType === 1) {
        s = (mon < 10 ? ('0' + mon) : mon) + '月' + (day < 10 ? ('0' + day) : day) + '日'
      } else {
        s = year + '-' + (mon < 10 ? ('0' + mon) : mon) + '-' + (day < 10 ? ('0' + day) : day)
      }
      return s
    },
    // 转换时间
    formatDate (date, today) {
      var YY = date.getFullYear()
      var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1)
      var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate())
      if (today === 1) {
        return YY + '/' + MM + '/' + DD
      } else {
        return YY + '-' + MM + '-' + DD
      }
    },
    // 把获取时间渲染到页面
    getDate (date, selectDate) {
      this.columns = []
      this.dateNum = []
      this.dates = []
      for (var i = 0; i < 365; i++) {
        if (selectDate === 1) {
          this.columnsSel = 364
          var dd = this.getBeforeDate(i, date)
          // 拼接年月日
          var dateTT = dd.split('-')[0] + '年' + dd.split('-')[1] + '月' + dd.split('-')[2] + '日'
          this.columns.unshift(dateTT.toString())
          // this.columns.push(dateTT.toString())
          this.dates.unshift(dateTT.toString())
        } else if (selectDate === 2) {
          var tt = this.getBeforeDate(i, date)
          this.dateNum.unshift(tt)
        }
      }
      var len = this.columns.length
      // 更改 今天 昨天 前天
      this.columns[len - 1] = '今天'
      this.columns[len - 2] = '昨天'
      this.columns[len - 3] = '前天'
    },
    // 点击 按钮 展示 日期
    DateSelect () {
      this.show = !this.show
      this.getDate(new Date(), 1)
      // this.getDate(new Date(), 2)
    },
    // 选择日期的 确定按钮
    onConfirm (value, index) {
      this.getDate(new Date(), 2)
      this.getDateList(this.userid, this.dateNum[index])
      this.show = !this.show
      this.columnsSel = index
      this.activeDate = this.dateNum[index]
      this.$refs.jPanChild.thisTime = this.dateNum[index] // this.timeSplice(this.dateNum[index])
      // this.oldTime = this.timeSplice(this.dateNum[index], 1)
    },
    get () {
      // axios.get('http://jmx-kfdj.com/kfhl/healthdataDynamic/findHealthdataDynamic')
      this.$http.findHealthdataDynamic()
        .then(res => {
          // console.log(res.data)
          this.getArr = res.data
          var time = this.$route.query.time
          if (time !== undefined && time !== null && time !== '') {
            this.activeDate = time
          } else {
            time = new Date()
          }
          this.getDateList(this.userid, this.formatDate(new Date(time)))
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 请求选择 某一天的 所有列的数据
    getDateList (userid, time) {
      // axios.get('http://jmx-kfdj.com/kfhl/healthdata/findHealthdataByName', {params: {userid: userid, time: time}})
      this.$http.findHealthdataByName({userid: userid, time: time})
        .then(res => {
          // console.log(res)
          this.everyList = []
          var xueTang = []
          for (var i = 0; i < res.data.length; i++) {
            if (i === 0) {
              xueTang.push(res.data[i])
            } else {
              if (i === 4) {
                this.everyList.splice(3, 0, '')
              } else {
              }
              this.everyList.push(res.data[i])
            }
          }
          this.xuetangList = xueTang[0][4]
          if (this.xuetangList[0].content !== undefined && this.xuetangList[1].content !== undefined && this.xuetangList[2].content !== undefined) {
            $('.ulList').eq(3).css({'height': 'auto'})
          } else if (this.xuetangList[0].content !== undefined && this.xuetangList[1].content !== undefined) {
            $('.ulList').eq(3).css({'height': 'auto'})
          } else if (this.xuetangList[0].content !== undefined && this.xuetangList[2].content !== undefined) {
            $('.ulList').eq(3).css({'height': 'auto'})
          } else if (this.xuetangList[1].content !== undefined && this.xuetangList[2].content !== undefined) {
            $('.ulList').eq(3).css({'height': 'auto'})
          } else {
            $('.ulList').eq(3).css({'height': '20vw'})
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 截取需要的 日期格式
    timeSplice (data) {
      var date = new Date(data)
      var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
      var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
      return hh + mm
    },
    // 点击 + 添加按钮 键盘的 确定 按钮
    numMsg (val, time, oldId) {
      this.timea = time
      // $('.ulList').eq(3).css({'height': 'auto'})
      if (val === '') {
        Toast('数据格式错误')
        return false
      }
      // if (this.oldTime.length <= 0) {
      //   this.timea = this.formatDate(new Date())
      //   console.log(this.formatDate(new Date()))
      // } else {
      //   this.timea = this.oldTime
      //   console.log(this.oldTime)
      // }
      // 判断日期是否 为 今天
      if (this.timea === this.formatDate(new Date())) { // 日期跟今天一致可无限添加
        if (this.listID === 4) { // 血糖 单独添加 携带chooseid
          // 添加数据
          this.setReturn(this.listID, this.userid, val, this.timea, '', this.chooseid)
        } else {
          // 添加数据
          this.setReturn(this.listID, this.userid, val, this.timea, '', '')
        }
      } else { // 日期跟今天不一致  如果数据 为空可添加一次  再次点击 +按钮就是修改
        if (this.content === undefined) { // 数据 为空可添加一次
          this.buJi = true
          // 添加数据
          if (this.listID === 4) { // 血糖 单独添加 携带chooseid
            this.setReturn(this.listID, this.userid, val, this.timea, '', this.chooseid)
          } else {
            this.setReturn(this.listID, this.userid, val, this.timea, '', '')
          }
        } else { // 已有数据 再次点击为修改
          // 获取已有的id
          if (oldId.length <= 0) {
            this.id = ''
          } else {
            this.id = oldId
          }
          // 修改数据
          if (this.listID === 4) { // 血糖
            this.setReturn(this.listID, this.userid, val, this.timea, this.id, this.chooseid)
          } else {
            this.setReturn(this.listID, this.userid, val, this.timea, this.id, '')
          }
        }
      }
    },
    // 添加数据返回给后台
    setReturn (typeid, userid, content, timea, id, chooseid) {
      // axios.get('http://jmx-kfdj.com/kfhl/healthdata/saveHealthdata', {params: {typeid: typeid, userid: userid, content: content, timea: timea, id: id, chooseid: chooseid}})
      this.$http.saveHealthdata({typeid: typeid, userid: userid, content: content, timea: timea, id: id, chooseid: chooseid})
      // id , id: id
        .then(res => {
          // 重新查询对应 页面的值
          this.getDateList(this.userid, this.timea)
          // console.log(res)
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 点击 + 图标
    selectNumber (typeid, unit, thisNull, content, oldTime, oldId) {
      if (this.isEdit === 0) {
        // Toast('')
        return false
      } else {
        if (typeid == 3 && sessionStorage.getItem('sys') === 'ANDROID') {
          window.WebViewJavascriptBridge.callHandler('goHealthManagementAdd', '', function (responseData) {})
          return false
        } else if (typeid == 4 && sessionStorage.getItem('sys') === 'ANDROID') {
          window.WebViewJavascriptBridge.callHandler('goAddBloodGlucose', '', function (responseData) {})
          return false
        } else if (typeid == 3) {
          this.$router.push({path: '/AddXueYa', query: {userid: this.userid}})
          return false
        } else if (typeid == 4) {
          this.$router.push({path: '/AddXueTang', query: {userid: this.userid}})
          return false
        } else if (typeid == 6) {
          this.$router.push({path: '/AddTiZhong', query: {userid: this.userid}})
          return false
        }
        this.content = content
        this.$refs.jPanChild.typeid = typeid
        if (content === undefined || content === '') { // 如果 没有content内容
          this.listID = typeid
          this.unitText = unit
          this.$refs.jPanChild.NoText = thisNull
          this.$refs.typeID = typeid
          if (typeid === 1) {
            this.$refs.jPanChild.kong()
          } else if (typeid === 2) {
            this.$refs.jPanChild.block()
          } else if (typeid === 3) {
            this.$refs.jPanChild.xie()
          } else if (typeid === 4) {
            this.xueTangShow = true
          } else if (typeid === 5) {
            this.$refs.jPanChild.kong()
          } else if (typeid === 6) {
            this.$refs.jPanChild.block()
          }
        } else if (content.length > 0) { // 如果 有content内容
          this.listID = typeid
          this.unitText = unit
          if (oldTime.split(' ')[0] === this.formatDate(new Date(), 1)) { // 有内容 日期是今天
            if (typeid === 1) {
              this.$refs.jPanChild.kong()
            } else if (typeid === 2) {
              this.$refs.jPanChild.block()
            } else if (typeid === 3) {
              this.$refs.jPanChild.xie()
            } else if (typeid === 4) {
              this.xueTangShow = true
            } else if (typeid === 5) {
              this.$refs.jPanChild.kong()
            } else if (typeid === 6) {
              this.$refs.jPanChild.block()
            }
            this.$refs.jPanChild.numText = thisNull
            this.$refs.jPanChild.NoText = thisNull
          } else if (oldTime.split(' ')[0] !== this.formatDate(new Date(), 1)) { // 有content内容 日期不是今天的日期
            if (typeid === 1) {
              this.$refs.jPanChild.kong()
            } else if (typeid === 2) {
              this.$refs.jPanChild.block()
            } else if (typeid === 3) {
              this.$refs.jPanChild.xie()
              var left = content.toString().split('/')[0]
              var right = content.toString().split('/')[1]
              this.$refs.jPanChild.inputLeftText = left
              this.$refs.jPanChild.inputRightText = right
            } else if (typeid === 4) {
              this.$refs.jPanChild.block()
            } else if (typeid === 5) {
              this.$refs.jPanChild.kong()
            } else if (typeid === 6) {
              this.$refs.jPanChild.block()
            }
            this.$refs.jPanChild.numText = content
          }
        }
        this.$refs.jPanChild.oldTime = oldTime
        this.$refs.jPanChild.oldId = oldId
      }
    },
    // 点击跳转 页面
    go (url, id, title, unit) {
      // 自定义健康管理页面名称
      if (id == 3 && sessionStorage.getItem('sys') === 'ANDROID') {
        window.WebViewJavascriptBridge.callHandler('goHealthManagement', '', function (responseData) {})
        return false
      } else if (id == 4 && sessionStorage.getItem('sys') === 'ANDROID') {
        window.WebViewJavascriptBridge.callHandler('goBloodGlucose', '', function (responseData) {})
        return false
      } else if (id == 3) {
        this.$router.push({path: '/XueYaEChart', query: {userid: this.userid}})
        return false
      } else if (id == 4) {
        this.$router.push({path: '/XueTangEchart', query: {userid: this.userid}})
        return false
      } else if (id == 6) {
        this.$router.push({path: '/TiZhongEChart', query: {userid: this.userid}})
        return false
      } else if (id == 1) {
        this.$router.push({path: '/YunDongEchart', query: {userid: this.userid}})
        return false
      }
      this.$router.push({path: url, query: { id: id, titleMsg: title, unitGo: unit, userid: this.userid, isEdit: this.isEdit }})
    },
    // 返回
    onClickLeft () {
      // 移除滚动事件
      window.removeEventListener('scroll', this.handleScroll, true)
      $('.tabHeader').removeClass('gu')
      window.history.go(-1)
      // this.$router.push({path: '/', query: { userid: this.userid }})
    },
    // 获取我的健康档案的 个人基本信息
    getPeople () {
      // axios.post('http://jmx-kfdj.com/hisdemo/Healthinformationpeople?mzhm=' + mzhm)
      // this.$http.Healthinformationpeople({mzhm: mzhm})
      //   .then(res => {
      //     // console.log(res)
      //     this.formItemList = res.data
      //   })
      //   .catch(err => {
      //     console.log(err)
      //   })
      this.$http.findPersonal({USER_ID: this.userid})
        .then(res => {
          console.log(res)
          var url
          if (res.data.PHOTO.substring(0, 4) === 'http') {
            url = res.data.PHOTO
          } else {
            url = ImgHttp.imgHttp + res.data.PHOTO
          }
          var obj = {
            PHOTO: url,
            phone: res.data.phone,
            age: res.data.age,
            birthday: res.data.birthday,
            name: res.data.name,
            sex: res.data.sex,
            activity: res.data.activity,
            address: res.data.address + res.data.xiangxiaddress,
            eatinghabits: res.data.eatinghabits,
            emergencycontact: res.data.emergencycontact,
            emergencycontactphone: res.data.emergencycontactphone,
            familydoctor: res.data.familydoctor,
            livingenvironment: res.data.livingenvironment,
            physicalcondition: res.data.physicalcondition,
            sleep: res.data.sleep
          }
          this.formItemList.push(obj)
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 康复评估表 http://jmx-kfdj.com/hisdemo/PingGu
    getPingGu (mzhm) {
      // axios.post('http://jmx-kfdj.com/hisdemo/PingGu?mzhm=' + mzhm + '&pageSize=')
      this.$http.PingGu({mzhm: mzhm, pageSize: ''})
        .then(res => {
          // console.log(res)
          // 删除最后一条数据
          res.data.splice(-1)
          this.PingGUList = res.data
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 康复治疗表 http://jmx-kfdj.com/hisdemo/zhiliao
    getZhiliao (mzhm) {
      // axios.get('http://jmx-kfdj.com/hisdemo/zhiliao?mzhm=' + mzhm + '&pageSize=')
      this.$http.zhiliao({mzhm: mzhm, pageSize: ''})
        .then(res => {
          // 删除最后一条数据
          res.data.splice(-1)
          this.ZhiliaoList = res.data
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 康复护理表 http://jmx-kfdj.com/hisdemo/HuLi
    getHuLi (mzhm) {
      // axios.get('http://jmx-kfdj.com/hisdemo/HuLi?mzhm=' + mzhm + '&pageSize=')
      this.$http.HuLi({mzhm: mzhm, pageSize: ''})
        .then(res => {
          // 删除最后一条数据
          res.data.splice(-1)
          this.HuLiList = res.data
        })
        .catch(err => {
          console.log(err)
        })
    },
    handleScroll () {
      if (this.active === 1) {
        let scrollTop = $('.tableInf').offset().top
        if (scrollTop < 10) {
          $('.tabHeader').addClass('gu')
        } else {
          $('.tabHeader').removeClass('gu')
        }
      } else {
        // 移除滚动事件
        window.removeEventListener('scroll', this.handleScroll, true)
        $('.tabHeader').removeClass('gu')
      }
      // console.log(scrollTop)
    },
    // 康复情况 按钮切换事件
    btnChange (index) {
      this.msg = index
      this.changeTab(this.dayIndex)
      if (index === 1) {
        this.getData()
      }
    },
    // 获取 几天 内的数据 http://jmx-kfdj.com/kfhl/healthdata/findHealthdataByTimeFenZu
    getHealth (n) {
      // axios.get('http://jmx-kfdj.com/kfhl/healthdata/findHealthdataByTimeFenZu',
      // {params: {userid: this.userid, n: n}})
      this.$http.findHealthdataByTimeFenZu({userid: this.userid, n: n})
        .then(res => {
          // console.log(res)
          this.tableList = res.data
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 日期选择 切换按钮事件
    changeTab (index) {
      this.dayIndex = index
      if (index === 0) {
        this.getHealth(7)
      } else if (index === 1) {
        this.getHealth(15)
      } else if (index === 2) {
        this.getHealth('')
      }
    },
    xiangqing (time) {
      this.$router.push({path: '/infoHealth', query: {'userid': this.userid, 'time': time, 'msg': this.msg, 'dayIndex': this.dayIndex, 'active': this.active}})
    },
    // 获取我的评估列表 http://jmx-kfdj.com/kfhl/miniassess/getMySubjects
    getData () {
      this.$http.getMySubjects({USER_ID: this.userid,
        name: '',
        startTime: '',
        endTime: '',
        TYPE: 1,
        DIS_ID: ''})
      // axios.get('http://jmx-kfdj.com/kfhl/miniassess/getMySubjects', {params:
      //     {USER_ID: userid, name: name, startTime: startTime, endTime: endTime}})
        .then(res => {
          console.log(res)
          this.selfList = res.data
        })
        .catch(err => {
          console.log(err)
        })
    }
  }
}
</script>
  <style scoped>
    *{
      margin: 0;
      padding: 0;
    }
    /*头部 nav-bar*/
    /deep/ .van-nav-bar{
      height: 12vw;
      display: flex;
      align-items: center;
    }
    .all{
      background: #FAF9FE;
      /*height: 92vh;*/
      height: 100%;
      overflow: auto;
    }
    header{
      width: 100%;
      height: 12vw;
      display: flex;
      justify-content: space-between;
      align-items: center;
      position: sticky;
      top: 0;
      background: #FFFFFF;
    }
    .div:nth-child(1) {
      margin-left: 15px;
    }
    .div:nth-child(2) {
      margin-right: 15px;
    }
    .ulList{
      width: 95vw;
      height: 20vw;
      background-color: #fff;
      border-radius: 10px;
      margin: 3vw auto auto auto;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
    }
    .ulList:last-child{
      margin-bottom: 10px;
    }
    .height{
      height: auto !important;
    }
    .left{
      /*width: 30vw;*/
      height: 100%;
      display: flex;
      align-items: center;
      font-size: 4vw;
      font-family: PingFang SC;
      /*font-weight: bold;*/
      color: #333333;
      margin-left: 5vw;
      /*background-color: blanchedalmond;*/
    }
    .left img{
      width: 6vw;
      height: 6vw;
      margin-right: 3vw;
    }
    .center{
      width: 53%;
      height: 100%;
      display: flex;
      flex-direction: column;
      align-content: space-around;
      justify-content: center;
    }
    .center .num{
      /*font-size: 5vw;*/
      font-size: 21px;
      font-family: PingFang SC;
      font-weight: 500;
      color: #1DA4F2;
      margin-left: 0.5vw;
    }
    .center  .center_Top{
      width: 100%;
      /*margin: 2.5vw auto;*/
    }
    .center  .center_Bottom{
      /*width: 36vw;*/
      margin: 2vw 0;
    }
    .center .unit, .time{
      font-size: 16px;
      font-family: PingFang SC;
      font-weight: 500;
      color: #999999;
      margin-bottom: 2vw;
    }
    .right{
      margin-right: 8vw;
      /*background-color: blanchedalmond;*/
    }
    .right img{
      width: 8vw;
      height: 8vw;
    }
    .title{
      font-size: 4vw;
    }
    .allValue{
      width: 100%;
      height: 15vw;
      /*background-color: palegoldenrod;*/
      line-height: 15vw;
    }
    /deep/ .van-hairline--bottom::after{
      border: none;
    }
    /**/
    /deep/ .van-picker{
      height: 70vw;
    }
    /*修改选择日期的 确定按钮*/
    /*/deep/ .van-picker__confirm{
      margin-right: 10vw;
      text-indent: -2000px;
      background: url("../assets/确定@2x.png") no-repeat center center;
      background-size: 45% 35%;
      width: 10vw;
      height: 10vw;
    }*/
    /*修改选择日期的 取消按钮*/
    /deep/ .van-picker__cancel{
      font-size: 18px;
    }
    /* 更改日期 确定按钮 颜色*/
    /deep/ .van-picker__confirm{
      color: #1DA4F2;
      font-size: 18px;
    }
    /* 更改日期 中间文字部分 字体大小*/
    /deep/ .van-picker__title {
      font-size: 18px;
    }
    /* 更改选择日期的 取消按钮 字体大小*/
    /deep/ .van-picker__cancel{
      /*font-size: 4.5vw;*/
    }
    /deep/ .van-picker-column__item{
      font-size: 18px;
    }
    /deep/ .van-icon-arrow-left::before {
      content: '\F008';
      /*font-size: 6vw;*/
    }
    /*选择日期圆角*/
    /deep/ .van-popup--bottom.van-popup--round {
      border-radius: 30px 30px 0 0;
    }
    /deep/ .van-picker__toolbar{
      margin-bottom: 10vw;
      border-bottom: 1px solid #c7c7cb;
    }
    /deep/ .van-field__control{
      color: #1DA3F2;
    }
    /deep/ .header .van-image__img{
      width: 11vw;
    }
    .fanhui{
      display: flex;
      align-items: center;
      color: #1da4f2;
      /*align-items: center;*/
    }
    .fanhui  img{
      width: 7px;
      height: 13px;
      margin-right: 5px;
    }
    .sides{
      font-size: 15px;
      font-family: PingFang SC;
      font-weight: bold;
    }
    /*  我的健康档案*/
    .gu {
      width: 100%;
      position: fixed;
      top: 10vw;
    }
    .content {
      height: 87vh;
      overflow: scroll;
    }

    /*.content .center {
      display: inline-block;
      width: 90%;
      !*text-align: center;*!
    }*/

    /*个人基本信息*/
    .personalInf {
      width: 100%;
      margin-bottom: 3vw;
    }
    /deep/ .van-cell--clickable{
      /*height: 44px;*/
      display: flex;
      align-items: center;
      color: #1DA4F2;
      /*border-bottom: 1px solid #ededed;*/
    }
    /deep/ .van-cell__title{
      font-family: PingFang SC;
      font-weight: bold;
      font-size: 15px;
      border-left: 2px solid #1DA4F2;
      padding-left: 5px;
      height: 4vw;
      display: flex;
      align-items: center;
      /*height: 24px;*/
    }
    .headerText {
      width: 100%;
      height: 11vw;
      font-size: 4vw;
      line-height: 11vw;
      background-color: #fff;
      /*margin-bottom: 0.3vw;*/
    }

    .header_text {
      height: 4vw;
      padding-left: 2vw;
      border-left: 2px solid #1DA4F2;
      font-family: PingFang SC;
      font-weight: 500;
      color: #1DA4F2;
      margin-left: 16px;
      display: flex;
      align-items: center;
    }

    .personalInf_content {
      width: 100%;
      background-color: #ffffff;
    }

    .personalInf_content ul li:nth-child(1) {
      height: 14vw;
    }

    .personalInf_content ul li {
      width: 100%;
      height: 11vw;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .personalInf_content ul li a {
      font-size: 15px;
      font-family: PingFang SC;
      font-weight: 500;
      color: rgba(51, 51, 51, 1);
    }

    .personalInf_content ul li a:nth-child(2) {
      color: #999;
    }

    .personalInf_img {
      width: 13vw;
      height: 13vw;
      margin-right: 2vw;
      border-radius: 50%;
    }

    .leftText {
      width: 40%;
    }

    .rightText {
      width: 60%;
      display: flex;
      flex-direction: row-reverse;
    }

    /*  表格*/
    /* .tableInf {

    } */

    .tabHeader {
      font-size: 15px;
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      /*line-height: 11vw;*/
      background-color: #fff;
      margin-bottom: 1vw;
    }
    .tabHeader a{
      /*height: 24px;*/
      display: flex;
      align-items: center;
      font-family: PingFang SC;
      font-weight: bold;
    }
    .tabHeader div{
      display: flex;
      align-items: center;
      height: 44px;
      border-bottom: 1px solid #ededed;
      /*margin-top: 3vw;*/
    }
    .btn {
      /*width: 60px;*/
      /*height: 22px;*/
      background: #F4F8F9;
      border-radius: 22px;
      line-height: 22px;
      border: none;
      /*font-size: 15px;*/
      margin-left: 2vw;
      padding: 2px 10px;
      /*padding: 0 2vw;*/
    }

    /*点击的切换*/
    .cur {
      color: #fff;
      background-color: #1DA4F2;
    }
    .tab1{
      height: 50vh;
    }
    .tab {
      height: auto;
      /*overflow: scroll;*/
      background-color: white;
      margin-bottom: 0.5vw;
    }

    .tab ul {
      display: flex;
      list-style: none;
      font-size: 3.5vw;
      padding: 3vw 0;
      box-sizing: border-box;
      justify-content: space-between;
    }

    .tab ul li a {
      font-family: PingFang SC;
      font-weight: 500;
      height: 6.5vw;
      line-height: 6.5vw;
    }

    .flLeft {
      display: flex;
      flex-wrap: wrap;
      flex-direction: column;
      width: 25%;
      padding-left: 5vw;
      /*background-color: red;*/
    }

    .flRight {
      display: flex;
      flex-wrap: wrap;
      flex-direction: column;
      width: 68%;
      /*background-color: aqua;*/
    }

    .red {
      color: rgba(211, 47, 47, 1);
    }
    /*底部高度*/
    /deep/ .van-tabbar{
      height: 8vh;
    }
    .table{
      width: 100%;
      text-align: center;
      border-top-left-radius: 20px;
      border-top-right-radius: 20px;
      overflow: hidden;
      table-layout: fixed;
    }
    .table thead tr{
      background: #1DA4F2;
      /*height: 11vw;*/
      color: #fff;
      font-size: 14px;
      height: 44px;
    }
    .table tbody tr{
      /*height: 18vw;*/
      height: 44px;
      font-size: 12px;
    }
    .table tbody tr td:nth-child(1){
      box-shadow: -1px 0px 0px 0px rgba(0, 0, 0, 0.1), 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
    }
    .table tbody tr td:nth-child(2){
      box-shadow: -1px 0px 0px 0px rgba(0, 0, 0, 0.1), 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
    }
    .spanDiv::-webkit-scrollbar{
      display: none;
    }
    .spanDiv{
      overflow-x: scroll;
      width: 70vw;
      display: inline-flex;
    }
</style>
